<%--
  Created by IntelliJ IDEA.
  User: 123
  Date: 2020/7/4
  Time: 17:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="true" %>
<%@include file="/common/com.jsp"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<html>
<head>
    <title>采购人员</title>
</head>
<body>
<div id="root">
<shiro:hasPermission name="root:add">
    <i-button type="primary" @click="add">添加采购人</i-button>
</shiro:hasPermission>
    <i-table :columns="columns" :data="data" height="400" Border stripe>
     <%--   <template slot-scope="{row,index}" slot="gender">
            {{row.gender==1?"男":"女"}}
        </template>--%>
        <template slot-scope="{row,index}" slot="action">
            <shiro:hasPermission name="root:update">
                <i-Button type="info" size="large"  @click="update(row,index)">修改</i-Button>
            </shiro:hasPermission>
            <shiro:hasPermission name="root:del">
                <i-Button type="error" size="large" @click="del(row,index)">删除</i-Button>
            </shiro:hasPermission>
        </template>
    </i-table>
    <Modal v-model="modaladd" title="添加角色" @on-ok="doadd">
        <i-form :label="width=80">
            <Form-Item label="姓名:">
                <Input type="text" v-model="lin.purName" placeholder="请输入采购人姓名">
            </Form-Item>
              <%--  <Input type="text" v-model="lin.purSex" placeholder="请输入采购人性别">--%>
                  <Form-Item label="性别">
                      <Radio-Group v-model="lin.purSex">
                          <Radio label="女">
                          </Radio>
                          <Radio label="男">
                          </Radio>
                      </Radio-Group>
                  </Form-Item>
            </Form-Item>

            <Form-Item label="手机号码:">
                <Input type="text" v-model="lin.purPhone" placeholder="请输入采购人手机号码">
                <Form-Item label="加入时间">
                    <Date-Picker type="datetime" placeholder="请选择" format="yyyy-MM-dd" v-model="lin.purAdddate"></Date-Picker>
                </Form-Item>
            </Form-Item>
            <Form-Item label="联系地址:">
                <Input type="text" v-model="lin.purAddress" placeholder="请输入采购人联系地址">

            </Form-Item>
        </i-form>
    </Modal>
    <Modal v-model="modalupdate" title="修改角色" @on-ok="doupdate">
        <i-form :label="width=80">
            <Form-Item label="姓名:">
                <Input type="text" v-model="lin.purName" placeholder="请输入采购人姓名">
            </Form-Item>
            <Form-Item label="性别">
                <Radio-Group v-model="lin.purSex">
                    <Radio label="女">
                    </Radio>
                    <Radio label="男">
                    </Radio>
                </Radio-Group>
            </Form-Item>
            <Form-Item label="手机号码:">
                <Input type="text" v-model="lin.purPhone" placeholder="请输入采购人手机号码">

            </Form-Item>
            <Form-Item label="联系地址:">
                <Input type="text" v-model="lin.purAddress" placeholder="请输入采购人联系地址">

            </Form-Item>
        </i-form>
    </Modal>
</div>
</body>
<script>
    new Vue({
        el:"#root",
        data:{
            columns:[
                {title:"姓名",key:"purName"},
                {title:"性别",key:"purSex"},
                {title:"手机号码",key:"purPhone"},
                {title:"加入时间",key:"purAdddate"},
                {title:"联系地址",key:"purAddress"},
                {title:"操作",slot:"action",width:250},
            ],
            data:[],
            lin:{},
            modaladd:false,
            modalupdate:false,
        },
        mounted(){
                this.getRootList();
        },
        methods:{
            getRootList(){
                axios.get(`${apath}/sm/lin/select`)
                .then(({data})=>{
                    this.data=data.result;
                })
            },
          add(){
                this.lin={},
                    this.modaladd=true;
          },
          doadd(){
            axios.post(`${apath}/sm/lin/insert`,this.lin)
              .then(({data})=>{
                  iview.Message.success({content:data.msg})
                  this.getRootList();
              })
            },
            update(row,index) {
                this.lin = row;
                this.modalupdate = true;
            },
            doupdate(){
                let params=Qs.stringify(this.lin,{serializeDate:(data)=>{
                        return moment(data).format("YYYY-MM-DD");
                    }});
                axios.post(`${apath}/sm/lin/update`,Qs.parse(params))
                    .then(({data})=>{
                        iview.Message.success({content:data.msg})
                        this.getRootList();
                    })
            },
            del(row,index){
                let _this =this;
                iview.Modal.confirm({
                    title:"确实要删除此部门？",
                    content:"此操作不可逆，请考虑清楚",
                    onOk(){
                        axios.get(`${apath}/sm/lin/del/${row.id}`)
                            .then(({data})=>{
                                iview.Message.success({content:data.msg})
                                _this.getRootList()
                            })
                    }
                })
            },
        }
    })
</script>
</html>
